<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title></title>
</head>

<body>
	<div id="app">
		<anchored-heading :level="2">
			<a name="hello-world" href="#hello-world">
				Hello, world!
			</a>
		</anchored-heading>
	</div>
	<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
	<script>
		const app = Vue.createApp({});
		app.component('anchored-heading', {
			render() {
				const { h } = Vue;
				return h(
					'h' + this.level,  // tag name  例如 'h1' 'h2' 'h3'
					{},  // props/attributes  属性  
					this.$slots.default()  // array of children  children：默认插槽内容
				)
			},
			props: {
				level: {
					type: Number,
					required: true
				}
			}
		})
		app.mount('#app');
	</script>
</body>

</html>